<template>
  <div class="page-container">
    <div class="common-content-wrap">
      <TrTable
        :btnList="btnList"
        :total="totalNum"
        v-model="searchParams"
        :searchShowList="searchShowList"
        :searchHideList="searchHideList"
        :tableColumn="tableColumn"
        requestName="getMenuList"
        :tableData="assTableData"
        @export="operateHandle($event, 'export')"
        @rowEdit="operateHandle($event, 'rowEdit')"
        @select-change="changeHandle"
      />
      <TrEditPopup
        v-model="isShowEdit"
        :width="960"
        :title="'编辑'"
        :valueObj.sync="formObj"
        :formData="formData"
        :list="popupList"
        @close="isShowEdit = false"
        @confrim="confrimHandle"
      />
    </div>
  </div>
</template>

<script>
import { findByProperty } from "@/utils/util";
import { getColor } from "@/utils/billColor";
import { getList, edit } from "@/api/baseCode/material";
import enumData from "@/utils/enumCode.js";
import TrTable from "@/components/Tr-table/Tr-table.vue";
import TrEditPopup from "@/components/Tr-edit/Tr-edit-popup.vue";
export default {
  components: {
    TrTable,
    TrEditPopup,
  },
  name: "SupplierBox",
  data: () => ({
    popupList: [
      {
        label: "物料料号",
        type: "input",
        width: 50,
        value: "",
        disabled: true,
        isNeed: false,
        id: "materialCode",
      },
      {
        label: "物料名称",
        disabled: true,
        isNeed: false,
        type: "input",
        width: 50,
        value: "",
        id: "materialName",
      },
      {
        label: "物料规格",
        disabled: true,
        isNeed: false,
        type: "input",
        width: 50,
        value: "",
        id: "materialSpec",
      },
      {
        label: "供应商",
        disabled: true,
        isNeed: false,
        type: "input",
        width: 50,
        value: "",
        id: "supplierName",
      },
      {
        label: "单重",
        type: "input",
        disabled: true,
        isNeed: false,
        width: 50,
        value: "",
        id: "standardWeight",
      },
      {
        label: "单重单位",
        type: "input",
        disabled: true,
        isNeed: false,
        width: 50,
        value: "",
        id: "newWeightUnit",
      },
      {
        label: "数量单位",
        type: "input",
        disabled: true,
        isNeed: false,
        width: 50,
        value: "",
        id: "newNumUnit",
      },
      {
        label: "物料分类",
        disabled: true,
        type: "input",
        isNeed: false,
        width: 50,
        value: "",
        id: "materialCategoryName",
      },

      {
        label: "完工仓库",
        type: "loadselect",
        isNeed: false,
        width: 50,
        selectedLabel: "",
        requestObj: {
          url: "/api/mes-warehouse-service/warehouse/rpc-page",
          method: "post",
          searchKey: "warehouseName",
          rlLabel: "warehouseName",
          rlValue: "id",
          resultKey: "data,data,records",
        },
        value: "",
        id: "warehouseId",
      },
      {
        label: "料号类型",
        type: "select",
        multiple: true,
        isNeed: false,
        width: 50,
        list: [],
        value: [],
        id: "codeTypeList",
      },

      {
        label: "描述",
        type: "textarea",
        width: 100,
        value: "",
        id: "remark",
        isNeed: false,
      },
    ],
    tableColumn: [
      // {
      //   type: "text",
      //   label: "序号",
      //   value: "",
      // },
      {
        type: "text",
        label: "物料料号",
        value: "materialCode",
      },
      {
        type: "text",
        label: "物料名称",
        value: "materialName",
      },
      {
        type: "text",
        label: "物料规格",
        value: "materialSpec",
      },
      {
        type: "text",
        label: "物料供应商",
        value: "supplierName",
      },
      {
        type: "text",
        label: "数量单位",
        value: "newNumUnit",
      },
      {
        type: "text",
        label: "状态",
        value: "isEnabledName",
      },
      {
        type: "text",
        label: "物料分类",
        value: "materialCategoryName",
      },
      {
        type: "text",
        label: "料号类型",
        value: "materialCodeTypeName",
      },
      {
        type: "text",
        label: "完工仓库",
        value: "warehouseName",
      },
      {
        type: "text",
        label: "描述",
        value: "remark",
      },
      {
        type: "text",
        label: "ERP ID",
        value: "erpId",
      },
      {
        type: "option",
        label: "操作",
        fixed: "right",
        width: 60,
        showBtnList: [
          {
            label: "编辑",
            option: "rowEdit",
          },
        ],
      },
    ],
    searchShowList: [
      {
        id: "materialCode",
        type: "input",
        width: 33.33,
        label: "物料料号",
        value: "",
      },
      {
        id: "materialName",
        type: "input",
        width: 33.33,
        label: "物料名称",
        value: "",
      },

      {
        label: "物料分类",
        type: "loadselect",
        isNeed: false,
        width: 33.33,
        selectedLabel: "",
        requestObj: {
          url: "/api/mes-production-service/material-category/page",
          method: "post",
          searchKey: "categoryName",
          rlLabel: "categoryName",
          rlValue: "id",
          resultKey: "data,data,records",
        },
        value: "",
        id: "materialCategoryId",
      },
    ],
    searchHideList: [
      {
        label: "状态",
        type: "multiSelect",
        width: 33.33,
        list: [],
        value: [],
        id: "isEnabledList",
      },
      {
        id: "materialSpec",
        type: "input",
        width: 33.33,
        label: "物料规格",
        value: "",
      },
      {
        label: "厂商",
        type: "loadselect",
        width: 33.33,
        selectedLabel: "",
        requestObj: {
          url: "/api/mes-warehouse-service/supplier/page",
          method: "post",
          searchKey: "supplierName",
          rlLabel: "supplierName",
          rlValue: "id",
          resultKey: "data,data,records",
        },
        value: "",
        id: "supplierId",
      },
      // {
      //   id: "remark",
      //   type: "input",
      //   width: 33.33,
      //   label: "描述",
      //   value: "",
      // },
    ],
    btnList: [
      {
        label: "导出",
        option: "export",
        color: "blue",
      },
    ],
    assTableData: [],
    checkList: [],
    formObj: {},
    formData: {},
    searchParams: {
      current: 1,
      size: 10,
    },
    totalNum: 0,
    isShowEdit: false,
    editId: "",
    exportParams: {},
  }),
  methods: {
    async edit(params) {
      let res = await edit(params);
      // console.log(res);
      if (res.data.code != 200) return;
      this.$message.success(this.$t("msg.success"));
      this.getMenuList();
    },
    confrimHandle() {
      this.formObj.id = this.editId;
      this.formObj.materialCodeType = "";
      this.formObj.codeTypeList.forEach((item) => {
        this.formObj.materialCodeType += item + ",";
      });
      this.formObj.materialCodeType = this.formObj.materialCodeType.slice(
        0,
        -1
      );
      this.edit(this.formObj);
      this.isShowEdit = false;
    },
    findIndex(list, id) {
      return list.findIndex((item) => item.id == id);
    },
    async getEnmuData() {
      let res = await this.$fetchEnumData([enumData.isEnabledList]);
      let enCol = this.$findByProperty(
        this.searchHideList,
        "id",
        "isEnabledList"
      );
      this.$set(enCol, "list", res["PC-ENABLED-LIST"]);
    },
    async codeTypeList() {
      let res = await this.$fetchEnumData([enumData.codeTypeList]);
      let index = this.findIndex(this.popupList, "codeTypeList");
      this.popupList[index].list = res["PC-MATERIAL-CODE-TYPE"];
    },

    operateHandle(val, type) {
      this.$validateData(val, 3);
      this.editId = val.id;
      switch (type) {
        case "export":
          this.$exportHandle({ vm: this, params: this.searchParams });
          break;
        case "rowEdit":
          {
            this.formData = {
              ...val,
              newNumUnit: `${val.unitCode}(${val.unitName})`,
              newWeightUnit: `${val.standardWeightUnitCode}(${val.standardWeightUnitName})`,
            };
            if (val.materialCodeType) {
              let codeTypeList = val.materialCodeType.split(",");
              this.formData.codeTypeList = codeTypeList.map((item) => {
                return Number(item);
              });
            } else {
              this.formData.codeTypeList = [];
            }
            const column = findByProperty(this.popupList, "id", "warehouseId");
            column.selectedLabel = val.warehouseName;
            this.isShowEdit = true;
            console.log("编辑！！");
          }

          break;
        default:
          console.log("11");
          break;
      }
    },
    changeHandle(val) {
      this.checkList = val;
    },
    searchHandle() {
      // this.exportParams = JSON.parse(JSON.stringify(this.searchParams));
      this.getMenuList();
    },
    getMenuList() {
      getList(this.searchParams).then(({ data }) => {
        if (data.code != 200) return;
        this.$validateData(data.data.records);
        this.assTableData = data.data.records;
        this.assTableData.forEach((item) => {
          item["isEnabledNameColor"] = getColor("QT", item.isEnabled);
          item.newNumUnit = `${item.unitCode}(${item.unitName})`;
        });
        this.$validateData(this.assTableData);
        this.totalNum = data.data.total;
      });
    },
  },
  mounted() {
    this.getEnmuData();
    this.codeTypeList();
    // this.getMenuList();
  },
};
</script>

<style></style>
